//这个组件是所有的逻辑



//状态共享
import {createContext,useReducer} from "react";
// 颜色的上下文颜色共享
export const Colors = createContext({})
//改变颜色
export const UPDATA_COLOR = 'UPDATA_COLOR'

//reducer
const reducer = (state,action) => {
    switch (action.type){
        case UPDATA_COLOR:
            return action.color
        default:
            return state
    }
}

//颜色管理
export const Color = props => {
    //action.color默认是blue
    //调用dispatch的时候是一个对象两个属性一个type一个color
    let [color,dispatch] = useReducer(reducer,'blue')
    return (
        <div>
            <Colors.Provider
                /*这里的color是状态*/
                value={{
                    color:color,
                    dispatch:dispatch
                }}
            >
                {props.children}
            </Colors.Provider>
        </div>
    )
}
